export default {
  data () {
    return {
      // 商品分类表格数据
      categoriesData: [],
      // 控制添加商品分类模态框显示
      categoriesFormVisible: false,
      // 添加商品分类模态框数据
      form: {
        name: '',
        region: '',
        date1: '',
        date2: '',
        delivery: false,
        type: [],
        resource: '',
        desc: ''
      },
      // 联级选择器数据
      // value保存的是联级选择器中被选中的 父级 value='ziyuan' 和 子级 value='sketch'
      value: [],
      cascaderData: [
        {
          value: 'ziyuan',
          label: '资源',
          children: [
            {
              value: 'axure',
              label: 'Axure Components'
            },
            {
              value: 'sketch',
              label: 'Sketch Templates'
            },
            {
              value: 'jiaohu',
              label: '组件交互文档'
            }
          ]
        }
      ],
      // 联级选择器的配置
      cascaderProps: {
        value: 'cat_id',
        label: 'cat_name'
      }
    }
  },
  created () {
    this.loadCategoriesList()
    this.loadCascaderList()
  },
  methods: {
    // 加载3层商品分类
    async loadCategoriesList () {
      let res = await this.$axios.get('categories', {
        params: {
          type: 3
        }
      })

      // console.log(res)

      this.categoriesData = res.data.data
    },
    // 加载2层商品分类
    async loadCascaderList () {
      let res = await this.$axios.get('categories', {
        params: {
          type: 2
        }
      })

      console.log(res)
      this.cascaderData = res.data.data
    },
    // 点击添加分类按钮处理函数
    addCategories () {
      this.categoriesFormVisible = true
    },
    // 联级选择器发生改变后的回调函数
    handleChange (value) {
      console.log(value)
    },
    // 添加分类模态框点击确定处理函数
    async confirmAddcategories () {
      let res = await this.$axios.post(`categories`, {
        cat_pid: this.value[this.value.length - 1],
        cat_name: this.form.name,
        cat_level: this.value.length
      })

      console.log(res)
      // 添加成功，关闭模态框
      this.categoriesFormVisible = false
      // 刷新页面
      this.loadCategoriesList()
      // 消息提示
      this.$message({
        message: '添加商品分类成功',
        type: 'success'
      })
    }
  }
}
